<template>
    <div>
      <van-tabs  >
        <van-tab v-for="index in listData" :title="index.title" :key="index.title"  >
                <template #title >
                  <p @click="onclick(index._id)"> {{index.title}} </p>
                  </template>
                <cateOthers :ListData='CateList'></cateOthers>
        </van-tab>
    </van-tabs>
    </div>
</template>

<script>
import { cate, cateOther } from 'api/article'
import { Tab, Tabs } from 'vant';
import cateOthers from './cateOther'
export default {
  name: 'NetList',
  components: {
    [Tab.name]: Tab,
    [Tabs.name]: Tabs,
    cateOthers,
  },
  data() {
    return {
      listData: [],
      CateList: []
    }
  },
  created() {
    this.getList();
    this.onclick('5e98551cc375e05f9c14ecb9');
  },
  methods: {
    async getList() {
    var data = await cate();
    this.listData = data;
    console.log(data);
    },
    async onclick(id) {
      var data = await cateOther(id);
      this.CateList = data;
      console.log(this.CateList);
    }
  }
}
</script>
